<template>
    <div id="app">
      <Add/>
      <div class="card" v-for="item in stuData" :key="item.name">
        <Card :student="item"></Card>
      </div>
    </div>
  </template>
  
  <script>
     import "../../assets/css/report.css"
    import Card from "./components/Card.vue"
    import Add from "./components/Add.vue"
    export default {
      components:{
        Card,Add
      },
      setup() {
        const stuData = [
          {
            name: '张三',
            age: 20,
            sex: '男',
            head: 'https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fup.enterdesk.com%2Fedpic_360_360%2Fc8%2F5d%2F59%2Fc85d595ed206fa63bb7bc7d7d9d17353.jpg&refer=http%3A%2F%2Fup.enterdesk.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=jpeg?sec=1648255399&t=0999eef6cf2f4a0da0f06a37153f3a30',
            yw: 60,
            sx: 100,
            yy: 70,
          },
          {
            name: '李四',
            age: 20,
            sex: '男',
            head: 'https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fup.enterdesk.com%2Fedpic%2F36%2Faf%2F84%2F36af84b51d35d4e560fb92fa065fe1d6.jpg&refer=http%3A%2F%2Fup.enterdesk.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=jpeg?sec=1648255399&t=d24abc41a0a5bc533cf0d8e42257a3c1',
            yw: 50,
            sx: 100,
            yy: 40,
          },
          {
            name: '王五',
            age: 20,
            sex: '男',
            head: 'https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fup.enterdesk.com%2F22%2Fa6%2F5d%2F83%2Fae689318a827319a98788026bb32d99a.jpg&refer=http%3A%2F%2Fup.enterdesk.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=jpeg?sec=1648255399&t=b85a8b7e9a853d96055aab2182fd4379',
            yw: 80,
            sx: 100,
            yy: 60,
          },
        ]
        return {
          stuData
        }
      }
    }
  </script>
  